import {Callout} from 'nextra-theme-docs';

# useScrollHandlers

Create a custom scrollable view inside the action sheet. The scrollable view must implement `onScroll`, and `onLayout` props.

Parameters:

`options`

A unique id for the `ScrollView` or `FlatList`. This id has to be unique per action sheet component.

| Type                                           | Required |
| ---------------------------------------------- | -------- |
| [DraggableNodeOptions](./draggablenodeoptions) | false    |

```tsx
import {ScrollView} from 'react-native';
import ActionSheet, {useScrollHandlers} from 'react-native-actions-sheet';
import {NativeViewGestureHandler} from 'react-native-gesture-handler';

const ExampleSheet = () => {
  const handlers = useScrollHandlers();
  return (
    <ActionSheet>
      <NativeViewGestureHandler
        simultaneousHandlers={handlers.simultaneousHandlers}>
        <ScrollView {...handlers}></ScrollView>
      </NativeViewGestureHandler>
    </ActionSheet>
  );
};
```

<Callout>
  Internally the hook simply provides information about the ScrollView layout &
  it's current position based on which the action sheet decides whether
  scrolling should be enabled or not.
</Callout>
